<template>
  <view>
    <view class="login-box">
      <uni-icons type="contact-filled" size="100"></uni-icons>
      <!--  open-type="getUserInfo" @getuserinfo="getUserInfo" -->
      <button type="warn" class="login-btn" @click="getUserInfo">登录</button>
      <text class="login-text">登陆后尽享更多权益</text>
    </view>
  </view>
</template>

<script>
  import { mapMutations, mapState } from 'vuex'
  export default {
    name:"my-login",
    data() {
      return {
        
      };
    },
    computed: {
      ...mapState('m_user', ['redirectInfo'])
    },
    methods: {
      ...mapMutations('m_user', ['updataUserInfo', 'upDataToken', 'updataRedirectInfo']),
      // 用户授权登录信息
      getUserInfo(e) {
        const that = this
        uni.getUserProfile({
          desc: '请授权登录信息',
          success(res) {
            uni.showMsg('授权成功')
            that.updataUserInfo(res.userInfo)
            that.getToken(res)
            if(that.redirectInfo && that.redirectInfo.openType == 'switchTab') {
              uni.switchTab({
                url: that.redirectInfo.from
              })
              that.updataRedirectInfo(null)
            }
          },
          fail() {
            uni.showMsg('您已取消授权')
          }
        })
      },
      // 保存 token
      async getToken(userInfo) {
        const [err, res] = await uni.login({}).catch(err => err)
        if(err || res.errMsg !== 'login:ok') return uni.showMsg('登陆失败！')
        const query = {
          code: res.code,
          encryptedData: userInfo.encryptedData,
          iv: userInfo.iv,
          rawData: userInfo.rawData,
          signature: userInfo.signature
        }
        // 接口没权限，模拟假的数据
        const {data: loginResult} = await uni.$http.post('/api/public/v1/users/wxlogin', query)
        // Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjEyLCJpYXQiOjE1MjU0MDIyMjMsImV4cCI6MTUyNTQ4ODYyM30.g-4GtEQNPwT_Xs0Pq7Lrco_9DfHQQsBiOKZerkO-O-o      Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjIzLCJpYXQiOjE1NjQ3MzAwNzksImV4cCI6MTAwMTU2NDczMDA3OH0.YPt-XeLnjV-_1ITaXGY2FhxmCe4NvXuRnRB8OMCfnPo
        this.upDataToken('Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjIzLCJpYXQiOjE1NjQ3MzAwNzksImV4cCI6MTAwMTU2NDczMDA3OH0.YPt-XeLnjV-_1ITaXGY2FhxmCe4NvXuRnRB8OMCfnPo')
        uni.showMsg('登陆成功！')
      }
    }
  }
</script>

<style lang="scss">
.login-box {
  height: 750rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #ffffff;
  position: relative;
  overflow: hidden;
  
  &::after {
    content: ' ';
    display: block;
    background-color: #f5f5f5;
    height: 100rpx;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    border-radius: 50%;
    transform: translateY(50%);
  }
  
  .login-btn {
    width: 90%;
    border-radius: 50rpx;
    margin: 20rpx;
  }
  .login-text {
    font-size: 24rpx;
    color: gray;
  }
}
</style>